<template>
	<view>

		<!-- 钱包弹出框 -->
		<view class="topup-wallet-modal-container" v-if="walletOpen">
			<view class="topup_container ios">
				<view class="topup-box-wrap">
					<view class="topup-close-btn" @click="closeModel"></view>
					<view class="topup-overflow-hidden">
						<view class="topup-box" device="ios">
							<view class="topup-content" v-if="walletModelOpen">
								<view class="topup_step1_wrap">
									<view class="content_header">
										<view class="header">{{$t('my-web3-wallet')}}</view>
										<view class="balance_header">
											<view class="desc">USDT{{$t('balance')}}:</view>
											<view class="balance_input">
												<view>
													<text class="txt">{{amount}}</text>
												</view>
											</view>
											<view class="balance_transfer_btn" @click="openUplevel">
												<text>{{$t('invest')}}</text>
											</view>
										</view>
										<view class="balance_header">
											<view class="desc">RHD{{$t('block')}}{{$t('balance')}}:</view>
											<view class="balance_input">
												<view>
													<text class="txt">{{rhdamount}}</text>
												</view>
											</view>
											<view class="balance_transfer_btn" @click="openRhdUplevel">
												<text>{{$t('invest')}}</text>
											</view>
										</view>

										<view class="wallet_header">
											<view class="desc">{{$t('wallet')}}:</view>
											<view class="balance_input">
												<view>
													<text class="txt">{{address}}</text>
												</view>
											</view>
											<view class="copy_btn" @tap="clipboard">
												<image src="/static/images/common/copy.png" class="copy_btn"
													mode="widthFix"></image>
											</view>
										</view>
									</view>

								</view>
								<view class="topup_step1_wrap">
									<view class="content_headers">
										<view class="header">{{$t('my')}}{{$t('Star-ratings')}}</view>

									</view>
									<view class="wallet_star">
										<view class="wallet_star_box">
											<view class="wallet_star_spans">
												<image src="../../static/images/common/group_tier_1.png" mode="widthFix"
													class="wallet_star_img"></image>
											</view>

											<view class="wallet_star_span">

												<text
													v-if="walletData.starOne">{{$t('Star-ratings')}}{{walletData.starOne}}</text>
												<text v-else>{{$t('Star-ratings')}}{{$t('nones')}}</text>
											</view>
										</view>
										<view class="wallet_star_box">
											<view class="wallet_star_spans">
												<image src="../../static/images/common/group_tier_1.png" mode="widthFix"
													class="wallet_star_img"></image>
											</view>
											<view class="wallet_star_span">

												<text
													v-if="walletData.starTwo">{{$t('bonus')}}{{$t('level')}}{{walletData.starTwo}}</text>
												<text v-else>{{$t('bonus')}}{{$t('nones')}}</text>
											</view>
										</view>
									</view>

								</view>
							</view>

							<view class="topup-content" v-if="wallet_modal_box">
								<view class="topup_step1_wrap">
									<view class="content_header content_headers">
										<view class="header">{{$t('invest')}}{{$t('Star-ratings')}}</view>
										<view class="balance_header">
											<view class="desc">{{$t('my')}}USDT{{$t('balance')}}</view>
											<view class="balance_input">
												<view>
													<text class="txt">{{amount}}</text>
												</view>
											</view>

										</view>

										<view class="wallet_content mab-40">
											<view class="wallet_content_title bnone">
												{{$t('invest')}}{{$t('money')}}
											</view>
											<view>
												<input type="number" v-model="starMoney" class="up-money-input">
											</view>
										</view>
										<view class="wallet_bottom mab-40" :class="select_btn?'':'disabled_btn'">

											<view class="send" v-if="select_btn">
												<view v-if="!isloading" @click="updateOrder(1)">
													{{$t('invest')}}
												</view>
												<view v-else class="wallet_loadings" disabled>
													{{$t('invest')}}
												</view>
											</view>
											<view class="send disabled_btn" v-else>
												<view>
													{{$t('invest')}}
												</view>
											</view>
										</view>
										<view class="bottom_desc">
											充值金额为100-12000U,100的倍数
										</view>
									</view>
								</view>
							</view>
							<!-- rhd -->
							<view class="topup-content" v-if="wallet_modal_box2">
								<view class="topup_step1_wrap">
									<view class="content_header content_headers">
										<view class="header">{{$t('invest')}}{{$t('Star-ratings')}}</view>
										<view class="balance_header">
											<view class="desc">{{$t('my')}}{{$t('block')}}RHD{{$t('balance')}}</view>
											<view class="balance_input">
												<view>
													<text class="txt">{{rhdamount}}</text>
												</view>
											</view>

										</view>

										<view class="wallet_content mab-40">
											<view class="wallet_content_title bnone">
												{{$t('invest')}}{{$t('money')}}
											</view>
											<view>
												<input type="number" v-model="starMoney" class="up-money-input">
											</view>
										</view>
										<view class="wallet_bottom mab-40" :class="select_btn?'':'disabled_btn'">

											<view class="send" v-if="select_btn">
												<view v-if="!isloading" @click="updateOrder(2)">
													{{$t('invest')}}
												</view>
												<view v-else class="wallet_loadings" disabled>
													{{$t('invest')}}
												</view>
											</view>
											<view class="send disabled_btn" v-else>
												<view>
													{{$t('invest')}}
												</view>
											</view>
										</view>
										<view class="bottom_desc">
											充值金额为100-12000RHD,100的倍数
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>

</template>

<script>
	const copys = require("@/components/common/tui-clipboard/tui-clipboard.js")
	import yui from '@/common/httpRequest';
	import web3 from '@/common/web3Rpc.js';
	export default {
		name: 'walletPop',
		props: {
			//是否固定
			walletOpen: {
				type: Boolean,
				default: false
			},
			walletModelOpen: {
				type: Boolean,
				default: false
			},
		},
		mounted() {
			/* 获取钱包余额 */
			this.getWallet()
			this.address = yui.hidden(uni.getStorageSync("yy_wallet").address, 6, 6)
			this.uaddress = uni.getStorageSync("yy_wallet").address;
			this.getWalletStar()
		},
		data() {
			return {
				amount: '0.00',
				wallet_modal_box: false,
				wallet_modal_box2: false,
				address: '',
				subIndex: [],

				indexs: 0,
				select_btn: true,
				starMoney: '100',
				walletData: [],
				isloading: false,
				rhdamount: 0,
				types: 1,

			};
		},
		methods: {
			async getWallet() {
				try {
					let balance = await this.web3Rpc.getErc20Balance()
					this.amount = Math.round(parseFloat(balance) * 100) / 100;

					this.rhdamount = await this.web3Rpc.getErc20Balance('rhd')

				} catch (e) {
					//TODO handle the exception
				}

			},
			freshAmount() {
				// this.web3Rpc.getErc20Balance()
				// this.web3Rpc.transferErc20('0x4308662651dBF84B819314490299eC8eF6f5Ccd2',100);
			},
			closeModel() {
				this.$emit('closeWallet');
				this.walletModelOpen = false;
				this.wallet_modal_box2 = false;
				this.isloading = false;
			},
			clipboard: function(event) {

				copys.getClipboardData(this.uaddress, (res) => {
					if (res) {
						this.$emit('showTips', this.$t('copy-success'), 'green');
					} else {
						this.$emit('showTips', this.$t('copy-failed'), 'warning');
					}
				}, event)
			},
			openUplevel() {
				this.walletModelOpen = false;
				this.wallet_modal_box = true;
				this.wallet_modal_box2 = false;
			},
			openRhdUplevel() {
				this.wallet_modal_box2 = true;
				this.walletModelOpen = false;
				this.wallet_modal_box = false;
			},
			selectItem(index) {
				this.indexs = index
				this.starMoney = this.starData[index].value
				if (index < 12) {
					if (this.walletData.level_id >= index + 1) {
						this.select_btn = false
						this.types = 1;
					} else {
						this.select_btn = true
					}
					this.types = 1;

				} else {

					if (this.walletData.r_level >= index - 11) {
						this.select_btn = false
						this.types = 2;
					} else {
						this.select_btn = true
					}
					this.types = 2;

				}


			},
			getWalletStar() {
				let walletData = this.tui.request('/api/user/userInfo', 'post', '', 1000, 1, '', 'userInfo');
				Promise.resolve(walletData).then((value) => {
					if (value.code == 200) {
						this.walletData = value.data

						this.tui.setUserInfoData(yui.interfaceUrl() + value.data.avatar);
						if (this.walletData.level_id > 0) {
							this.select_btn = false
						} else {
							this.select_btn = true
						}
					}
				})

			},
			async updateOrder(type) {
				if (this.isloading) {
					return;
				}
				this.isloading = true;
				/* 拉起转账钱包 */
				let result = await this.tui.request('/api/user/createOrder', 'post', {
					money: this.starMoney,
					type: type
				}, 1000, 1, '', 'createOrder');
				if (result.code == 200) {
					let transferResult = await this.web3Rpc.transferErc20(result.data.address, result.data.money,
						result
						.data.orderno, type);
					if (transferResult == true) {
						this.$emit('showTips', this.$t('pay-success'), 'green');
						this.closeModel();
					} else {
						if (transferResult.code == -32000) {
							this.$emit('showTips', this.$t('handling-fees'), 'warning');
						} else {
							this.$emit('showTips', this.$t('Block-packaging-failed'), 'warning');
						}
					}
					this.isloading = false
				} else {
					this.$emit('showTips', result.message, 'warning');
					this.isloading = false
				}
			}
		}
	};
</script>

<style scoped>
	@import '../../static/css/defalut.css';

	.tui-tabs-view {
		width: 100%;
		border-radius: 14rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.tui-tabs-relative {
		position: relative;
	}

	.up-money-input {
		border: 2rpx solid #575454;
		padding: 16rpx 60rpx;
		text-align: center;
		border-radius: 10rpx;
	}

	.bottom_desc {

		width: 100%;
		font-size: 24rpx;
		height: 20%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		margin-bottom: 24rpx;
		color: #929398;
	}

	.yui-tab-title-clove {}

	.yui-tabs-tags {
		display: block;
		margin-top: 4rpx;
		text-align: center;
		font-size: 24rpx;
	}

	.tui-tabs-fixed {
		position: fixed;
		left: 0;
	}

	.tui-tabs-fixed::before,
	.tui-tabs-relative::before {
		content: '';
		position: absolute;
		border-bottom: 1rpx solid #eaeef1;
		-webkit-transform: scaleY(0.5) translateZ(0);
		transform: scaleY(0.5) translateZ(0);
		transform-origin: 0 100%;
		bottom: 0;
		right: 0;
		left: 0;
	}

	.tui-unlined::before {
		border-bottom: 0 !important;
	}

	.tui-tabs-item {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.tui-tabs-disabled {
		opacity: 0.6;
	}

	.tui-tabs-title {
		/* 	display: flex;
	align-items: center;
	justify-content: center; */
		text-align: center;
		position: relative;
		z-index: 2;
	}

	.tui-tabs-active {
		transition: all 0.15s ease-in-out;
	}

	.tui-tabs-slider {
		position: absolute;
		left: 0;
		transition: all 0.15s ease-in-out;
		z-index: 0;
		transform: translateZ(0);
	}
</style>